<template>
    <!-- 我的通知 -->
    <div class="notice-manage">
        <div class="search-container">
            <el-form
                ref="ruleFormRef"
                :model="queryParams.entity"
                label-width="80"
                inline
            >
                <el-form-item label="关键字" prop="title">
                    <el-input
                        v-model="queryParams.entity.title"
                        maxlength="60"
                        placeholder="通知标题"
                        clearable
                        @keyup.enter="handleQuery"
                    />
                </el-form-item>
                <el-form-item label="发布时间" prop="rangeTime">
                    <el-date-picker
                        v-model="queryParams.entity.rangeTime"
                        type="daterange"
                        start-placeholder="开始时间"
                        end-placeholder="结束时间"
                        format="YYYY-MM-DD"
                        value-format="YYYY-MM-DD"
                        style="width: 260px"
                    />
                </el-form-item>
                <el-form-item>
                    <el-button
                        type="primary"
                        icon="Search"
                        @click="handleQuery"
                    >
                        搜索
                    </el-button>
                    <el-button icon="Refresh" @click="handleResetQuery">
                        重置
                    </el-button>
                </el-form-item>
            </el-form>
        </div>
        <el-card shadow="never" class="table-container">
            <template #header>
                <el-button type="success" @click="handleAddFlow()">
                    <el-icon>
                        <Plus />
                    </el-icon>
                    新增
                </el-button>
            </template>
            <el-table
                v-loading="loading"
                :data="tableData"
                row-key="deptId"
                default-expand-all
                highlight-current-row
                border
            >
                <el-table-column
                    type="index"
                    label="序号"
                    :width="60"
                    align="center"
                />
                <el-table-column
                    v-for="(item, index) in columnData"
                    :key="index"
                    :prop="item.prop"
                    :label="item.label"
                    min-width="120"
                    :width="item.width || ''"
                    :fixed="item.fixed || false"
                    show-overflow-tooltip
                    :resizable="false"
                    align="center"
                >
                    <template #default="{ row }">
                        <span>{{ row[item.prop] }}</span>
                    </template>
                </el-table-column>

                <el-table-column label="操作" width="120" align="center">
                    <template #default="scope">
                        <el-button
                            type="primary"
                            icon="View"
                            link
                            @click="handleOpenNoticeDialog(scope.row)"
                        >
                            查看
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <!-- <Pagination
                v-if="total > 0"
                v-model:total="total"
                v-model:page="queryParams.pageNo"
                v-model:limit="queryParams.pageSize"
                @pagination="handleQuery"
            /> -->
        </el-card>
    </div>
</template>

<script setup>
// defineOptions({ name: 'NoticeManage' })
import { onMounted, reactive, ref, getCurrentInstance } from 'vue'
import { format, addDays } from 'date-fns'
// import Pagination from '@/components/Pagination.vue'
import { getDictOpt } from '@/utils/common'
// import { getMyNoticeList } from '@views/myNotice/api/myNotice'
import { getProcessList } from '../api/com'
import { PUBLISH_TYPE } from '@constants/dictionary'
import { useRouter } from 'vue-router'
const router = useRouter()
const { proxy } = getCurrentInstance()

// const dictOptions = ref(proxy.useDict('notice_type', 'public_level'))
// console.log(dictOptions)

const loading = ref(false)
const queryParams = reactive({
    entity: {
        title: '',
        rangeTime: [
            format(addDays(new Date(), -7), 'yyyy-MM-dd'),
            format(new Date(), 'yyyy-MM-dd')
        ]
    },
    pageNo: 1,
    pageSize: 10
})
// const total = ref(0)
const columnData = ref([
    {
        label: '创建人',
        prop: 'createName'
    },
    {
        label: '流程key',
        prop: 'processKey'
    },
    {
        label: '流程名称',
        prop: 'processName'
    }
])
const tableData = ref()
const ruleFormRef = ref(null)
const noticeParams = reactive({ visible: false })

// 获取数据
const handleQuery = async () => {
    loading.value = true
    const params = {
        tenantId: '',
        processKey: '',
        version: ''
    }
    const res = await getProcessList(params)
    loading.value = false
    tableData.value = res
    // loading.value = false
    // let _queryParams = JSON.parse(JSON.stringify(queryParams))
    // _queryParams.entity.startTime = _queryParams.entity.rangeTime
    //     ? _queryParams.entity.rangeTime[0] + ' 00:00:00'
    //     : ''
    // _queryParams.entity.endTime = _queryParams.entity.rangeTime
    //     ? _queryParams.entity.rangeTime[1] + ' 23:59:59'
    //     : ''
    // delete _queryParams.entity.rangeTime

    // const res = await getMyNoticeList(queryParams)
    // loading.value = false
    // if (res?.code === 200) {
    //     tableData.value = res.data.records || []
    //     total.value = res.total || 0
    // }
}

// 重置表单
// const handleResetQuery = () => {
//     ruleFormRef.value.resetFields()
//     queryParams.pageNo = 1
//     handleQuery()
// }
// 新增流程模版
const handleAddFlow = () => {
    router.push({ path: '/setting/process-manage' }) // 路由跳转
}

// 打开通知弹窗
const handleOpenNoticeDialog = (row) => {
    router.push({ path: '/setting/process-manage' }) // 路由跳转
    // noticeParams.id = row.id
    // noticeParams.visible = true
}

// 关闭通知弹窗
// const handleCloseNoticeDialog = () => {e
//     noticeParams.visible = false
// }

// 初始化
onMounted(() => {
    handleQuery()
})
</script>

<style scoped lang="less">
.el-table th,
.el-table td {
    text-align: center; /* 确保所有表头和单元格内容居中 */
}
</style>
